<template>
	<view class="my_user">
		<view  :style="{paddingTop: navHeight+'px',}">
			<view class="avatar flex-align" >
				<image src="https://xddserver.oss-cn-guangzhou.aliyuncs.com/blog/avatarImage/1728544800618_8800.webp" mode=""></image>
				<text>十八岁以后我的梦想变成了买车买房</text>
			</view>
		</view>

	</view>

</template>

<script setup>
	import {
		defineProps,
		onMounted,
		ref
	} from 'vue'
	const props = defineProps({
	})
	const navHeight = ref()
	onMounted(() => {
		const demo = uni.getMenuButtonBoundingClientRect()
		navHeight.value = demo.top
	})

	function skip() {
      uni.navigateTo({
      	url:"/pagesA/search/index"
      })
	}
</script>

<style lang="scss" scoped>
	.my_user {
		width: 100%;
		position: fixed;
		background-color: #fff;
		  opacity: 0;
		  transform: scale(0.95);
		  animation: fadeInScale 0.8s ease-in-out forwards;
		.avatar{
			margin-left: 10px;
			padding: 4px;
			image{
				width: 30px;
				height: 30px;
				border-radius: 50%;
			}
			text{
				font-size: 14px;
				margin-left: 6px;
				color: #333;
			}
		
		}
	}
/* 淡入+缩放动画 */
@keyframes fadeInScale {
  0% {
    opacity: 0;
    transform: scale(0.95);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
</style>